import {CCard} from '@/components/card'
import {IconImg} from '@/components/image'
import {CnBoldP, CnMediumP, CnNormalP} from '@/components/text'

const AboutUs = defineComponent({
  setup(props, ctx) {
    return () => (
      <div class='aboutUs'>
        <CnBoldP class='mt-11 text-20 rounded-4'>关于我们</CnBoldP>

        <CnNormalP class='mt-6 mb-20 text-4xText'>
          国内领先的全系列水检测设备仪器制造、服务商，浙江省高新科技企业
        </CnNormalP>

        <CCard title='关于我们' showTitle={false} class='bg-white'>
          <div class='px-18 mb-64'>
            <div class='py-14 mb-34'>
              <div class='flex items-center gap-x-28'>
                <IconImg imgName='logo-simple' class='w-70 h-70'></IconImg>
                <CnMediumP class='text-24'>恒蓝云，国内领先的水质检测科技企业</CnMediumP>
              </div>
            </div>
            <div class='mb-24 '>
              <CnNormalP class='mb-14 text-xText'>
                秉承着客户第一，科技驱动，产品赋能，合作共赢的目的.....
              </CnNormalP>
              <div class='grid 2xl:grid-cols-3 xl:grid-cols-3 lg:grid-cols-3 md:grid-cols-3 sm:grid-cols-3  gap-x-14 gap-y-14'>
                <div class='w-full h-186 bg-gray'></div>
                <div class='w-full h-186 bg-gray'></div>
                <div class='w-full h-186 bg-gray'></div>
              </div>
            </div>
            <div class=''>
              <CnNormalP class='mb-14 text-xText'>20年老店，浙大科技积累的全面绽放</CnNormalP>
              <div class='grid 2xl:grid-cols-3 xl:grid-cols-3 lg:grid-cols-3 md:grid-cols-3 sm:grid-cols-3 gap-x-14 gap-y-14'>
                <div class='w-full h-186 bg-gray'></div>
                <div class='w-full h-186 bg-gray'></div>
                <div class='w-full h-186 bg-gray'></div>
              </div>
            </div>
          </div>
        </CCard>
      </div>
    )
  }
})
export default AboutUs
